@pageMinWidth: 1400px;

@mainColor: #1890ff;
@lightColor: rgba(255, 255, 255, 0.65);

@mainBackColor: #f5f5f5;
@backColor1: white;

@clientHeight: document.body.clientHeight;
@footerHeight: 120px;

// --------------------------------------------------- 页面最小宽度 ---------------------------------------------------
// 设置最小宽度: 不穿参数时, 默认设置为 1400px; 可选参数与 min-width 属性值一样
.pageMinWidth(@minWidth: 1400px) {
  min-width: @minWidth;
}

// --------------------------------------------------- 文本, 行内块, 内联元素位置 ---------------------------------------------------
// 设置 text-align 属性: 不穿参数时, 默认设置为 center; 可选参数与 text-align 属性值一样
.textAlign(@position: center) {
  text-align: @position;
}

// --------------------------------------------------- display ---------------------------------------------------
.display(@showType: none) {
  display: @showType;
}

// --------------------------------------------------- 使用 flex 垂直水平居中 ---------------------------------------------------
.flexCenter () {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.scrollbar(
  @thumb-background: hsla(0,0%,100%,0.2),
  @thumb-shadow: hsla(0,0%,100%,0.05),
  @track-background:hsla(0,0%,100%,0.15),
  @track-shadow: rgba(37,37,37,0.05)
) {
  &::-webkit-scrollbar {
    width: 6px;
    height: 6px;
  }
  &::-webkit-scrollbar-thumb {
    background: @thumb-background;
    border-radius: 3px;
    box-shadow: inset 0 0 5px @thumb-shadow;
  }
  &::-webkit-scrollbar-track {
    background: @track-background;
    border-radius: 3px;
    box-shadow: inset 0 0 5px rgba(37, 37, 37, 0.05);
  }
}

.scrollbarLight {
  .scrollbar(
    hsla(0,0%,0%,0.2), hsla(0,0%,0%,0.05),
    hsla(0,0%,0%,0.15), rgba(255,255,255,0.05)
  );
}
